<!-- 查看，下载下载二维码 -->
<script type="text/javascript" src="/qr/qrcode.min.js"></script>
<script type="text/javascript" src="/qr/md5.js"></script>

<style>
    .inner_line {
        display: inline;
        cursor: pointer;
    }
</style>

<script type="text/javascript">
  function trim(str) {
    return str.replace(/^(\s|\u00A0)+/, '').replace(/(\s|\u00A0)+$/, '');
  }

  //显示对应的二维码
  var qrcode;

  function create_qr(qr_text, show_id) {
    //生成一个二维码,并显示出来
    //show_id : 显示位置div的id
    if (typeof qr_text == 'undefined') {
      qr_text = '';
    }
    if (typeof show_id == 'undefined') {
      show_id = '';
    }
    if (qr_text != '' && show_id != '') {
      var show_position = document.getElementById(show_id);

      qrcode = new QRCode(show_position, {
        width: 140,
        height: 140,
        correctLevel: 3
      });
      qrcode.makeCode(qr_text);
      return;
    }
  }

  function show_qr(qr, other_qrcode, e, url) {
    if (typeof url == 'undefined') {
      url = '';
    }

    if (url != '') {
      qrcode = new QRCode(document.getElementById("qrcode"), {
        width: 100,
        height: 100,
        correctLevel: 3
      });
      var x, y;
      var topscroll = $('.wrapper').scrollTop();

      x = e.clientX;
      y = e.clientY;// e.clientY; // e.offsetY;//e.screenY;// e.pageY

      //y = y-170;
      if (y <= 170) y = y + 40;
      else y = y - 170;

      document.getElementById("qrcode").style.left = x - 70 + 'px';
      document.getElementById("qrcode").style.top = y + 'px';
      qrcode.makeCode(url);
      document.getElementById("qrcode").style.display = 'block';
      return;
    }

    if (qr != '' || qr != null) {
      if (other_qrcode == 0) {
        var md5_val = $.md5(qr);
        md5_val = stringToHex(md5_val);
        md5_val = (parseInt(md5_val) % 256).toString(16);
        md5_val = md5_val.toUpperCase();
        var cnt = 2 - md5_val.length;
        var fill_val = '';
        if (cnt > 0) {
          for (var i = 0; i < cnt; i++) {
            fill_val += '0';
          }
          md5_val = fill_val + md5_val;
        }
        // qr = qr+'-'+md5_val+'-VSDIGITAL';
        // qr = qr+'-'+md5_val+'-VSDIGITAL';
      }
      qrcode = new QRCode(document.getElementById("qrcode"), {
        width: 100,
        height: 100,
        correctLevel: 3
      });
      var x, y;
      var topscroll = $('.wrapper').scrollTop();

      x = e.clientX;
      y = e.clientY;// e.clientY; // e.offsetY;//e.screenY;// e.pageY

      //y = y-170;
      if (y <= 170) y = y + 40;
      else y = y - 170;

      document.getElementById("qrcode").style.left = x - 70 + 'px';
      document.getElementById("qrcode").style.top = y + 'px';
      qrcode.makeCode(qr);
      document.getElementById("qrcode").style.display = 'block';
    }
  }

  function stringToHex(str) {
    var val = 0;
    for (var i = 0; i < str.length; i++) {
      if (i % 2 == 1) {
        val += parseInt(str.substring(i - 1, i + 1), 16);
      }
    }
    return val;
  }

  //不显示二维码
  function remove_qr() {
    document.getElementById("qrcode").innerHTML = "";
    document.getElementById("qrcode").style.display = 'none'
  }

  //下载对应的二维码(一个)
  function download_qr(qr, name) {
    qr = encodeURI(qr);

    if (qr != '') {
      var qrcode = new QRCode(document.getElementById("download_qr_div"), {
        render: 'canvas',
        width: 300,
        height: 300,
        imgWidth: 300, //图片宽
        imgHeight: 300, //图片高
        correctLevel: 3
      });
      var md5_val = $.md5(qr);
      md5_val = stringToHex(md5_val);
      md5_val = (parseInt(md5_val) % 256).toString(16);
      md5_val = md5_val.toUpperCase();
      // qr = qr+'-'+md5_val+'-VSDIGITAL';
      qrcode.makeCode(qr);
      var canvas = $('#download_qr_div').find("canvas").get(0);
      var array = null;
      try {
        var blob = canvas.msToBlob();
        navigator.msSaveBlob(blob, qr + '.jpg');
      } catch (err) {
        var url = canvas.toDataURL('image/jpeg');
        $("#download").attr('download', name + '.jpg');
        $("#download").attr('href', url).get(0).click();
        console.log("错误信息：" + err.message);
      }
      // try {//解决IE转base64时缓存不足，canvas转blob下载
      //     var blob = canvas.msToBlob();
      //     navigator.msSaveBlob(blob, qr+'.jpg');
      // } catch (e) {//如果为其他浏览器，使用base64转码下载
      //     var url = canvas.toDataURL('image/jpeg');
      //              console.log(url)
      //     $("#download").attr('download',name+'.jpg');
      //     $("#download").attr('href', url).get(0).click();
      // }
    }
  };

  //下载当前页面所有的二维码
  //    function download_qrs(){
  //	var qr_col = 0;
  //	var device_name_col = 0;
  //	var qrcode = new QRCode(document.getElementById("download_qr_div"), {
  //		render: 'canvas',
  //		width : 300,
  //		height : 300,
  //		imgWidth : 300, //图片宽
  //		imgHeight : 300, //图片高
  //		correctLevel: 3
  //	});
  //    	$("#device_gridview tr").each(function(i){
  //        	var device_name = '';
  //		if(i == 0){
  //			$(this).children("th").each(function(j){
  //				if($(this).text() == '二维码下载'){
  //					qr_col = j;
  //				}else if($(this).text() == '巡更点名称'){
  //					device_name_col = j;
  //				}
  //			});
  //		}else{
  //		$(this).children("td").each(function(j){
  //			if(j == device_name_col){
  //				device_name = $(this).text();
  //			}else if(j == qr_col){
  //				//生成并下载二维码
  //				if($(this).text() != ''){
  //					var md5_val = $.md5(encodeURI($(this).text()));
  //					md5_val = stringToHex(md5_val);
  //					md5_val = (parseInt(md5_val) % 256).toString(16);
  //					md5_val = md5_val.toUpperCase();
  //					var qr = encodeURI($(this).text())+'-'+md5_val+'-VSDIGITAL';
  //					qrcode.makeCode(qr);
  //
  //					var canvas = $('#download_qr_div').find("canvas").get(0);
  //					try {//解决IE转base64时缓存不足，canvas转blob下载
  //						var blob = canvas.msToBlob();
  //						navigator.msSaveBlob(blob, device_name+'.jpg');
  //					} catch (e) {//如果为其他浏览器，使用base64转码下载
  //						var url = canvas.toDataURL('image/jpeg');
  //						$("#download").attr('download',device_name+'.jpg');
  //						$("#download").attr('href', url).get(0).click();
  //					}
  //				}
  //			}
  //		});
  //		}
  //    	});
  //    };

  //    	      //创建压缩包对象 jszip.js
  // 	      var zip = new JSZip();
  // 	      //获取到所有已经生成好的二维码
  // 	      var canvases = $("#download_qr_div").find('canvas');
  // 	      $.each(canvases, function (i, item) {
  // 	          var imgdata = item.todataurl('image/jpeg').split('base64,')[1];
  // 	          var picname = $(item).data().device_name;
  // 	         zip.file(device_name, imgdata, { base64: true });
  // 	     });
  // 	     //下载压缩包
  // 	     zip.generateasync({ type: "blob" }).then(function (content) {
  // 	         // see filesaver.js
  // 	         saveas(content, "qr.zip");
  // 	     });
</script>

<!-- 查看，下载二维码 -->
<div id="qrcode_delete" align="center"
     style="border:1px solid #000;padding-top:20px; display:none; position: absolute; z-index: 100;width: 140px; height: 140px; background: white;"></div>
<div id="download_qr_div" style="display: none;"></div>
<a id="download" download="qrcode.jpg"></a>


<script>
  $(function () { // 放第一层 202009104
    $("body").append('<div id="qrcode" align="center" style="border:1px solid #000;padding-top:20px; display:none; position: absolute; z-index: 1000;width: 140px; height: 140px; background: white;"></div>');
  })
</script>


<!-- 调用方法-->

<!-- 1.在html页面底部引用;	2.在要显示qr的元素上加事件 -->
<!--<?//= $this->render('/show_download_qr/index'); ?>-->
